<template>
<div class="app">



    <header>
    <router-view name="header" />
  </header>
  <main>
    <router-view />
  </main>
  <footer>
    <router-view name="footer" />
  </footer>


</div>
</template>

<script>

export default {
name: '',
data() {
 return {}
},


}
</script>

<style lang="less" >
 html, body, .app {
    height: 100%;
  }

  .app {
    display: flex;
    flex-direction: column;

    main {
      flex: 1;
      overflow: auto;
    }
  }

</style>
